/*
  传递给父组件getTime(起始时间，结束时间)
  props:
    setValue 布尔值，是否提前设值
    startTime 起始时间 日期类型
    endTime 结束时间 日期类型
    (这三者是一同出现的，若setValue === true,则父组件获取值时也需设置startTime，endTime的值)
    getTime(开始时间，结束时间) 传递给父组件时间值
*/
import React, { Component } from 'react'
import { DatePicker  } from 'element-react'

class datePicker extends Component {
  constructor(props) {
    super(props)
    this.state = {
      endTime: null,
      startTime: null
    }
  }
  sendTime () {
    if (!this.props.setValue) {
      console.log(this.state.startTime)
      console.log(this.state.endTime)
      this.props.getTime(this.state.startTime, this.state.endTime)
    } else {
      if (this.state.startTime === null) {
        console.log(1)
        this.props.getTime(this.props.startTime, this.state.endTime)
      } else if (this.state.endTime === null) {
        console.log(2)
        this.props.getTime(this.state.startTime, this.props.endTime)
      } else {
        this.props.getTime(this.state.startTime, this.state.endTime)
      }
    }
  }
  beginTime (date) {
    this.setState({startTime: date},() => {this.sendTime()})
  }
  endTime (date) {
    this.setState({endTime: date},() => {this.sendTime()})
  }
  componentDidMount () {
  }
  render () {
    let startTime, endTime
    if (this.props.setValue) {
      startTime = this.props.startTime
      endTime = this.props.endTime
      console.log(startTime, endTime)
      if (startTime === null) startTime = new Date()
      if (endTime === null) endTime = new Date()
      startTime = new Date(startTime)
      endTime = new Date(endTime)
    } else {
      startTime = this.state.startTime
      endTime = this.state.endTime
    }
    return (
      <div className="datePicker">
        <DatePicker
          value={startTime}
          isShowTime={true}
          format="yyyy-MM-dd HH:mm:ss"
          placeholder="选择日期"
          onChange={this.beginTime.bind(this)}
          disabledDate={time=> {
            if (this.state.endTime) {
              return time.getTime() > new Date(this.state.endTime)
            }
          }}
          />
        <span className="selectWay">--</span>
        <DatePicker
          value={endTime}
          isShowTime={true}
          format="yyyy-MM-dd HH:mm:ss"
          placeholder="选择日期"
          onChange={this.endTime.bind(this)}
          disabledDate={time=>time.getTime() < new Date(this.state.startTime) - 3600 * 1000 * 12}
          />
      </div>
    )
  }
}
export default datePicker